<template>
  <div>
  <main role="main" aria-labelledby="main-title">
    <h1 id="main-title">**养老院</h1>
    <Div id="butt" align = "center">
      <!--<button type="button" class="btn"  style="background-color:#81DAF5;width: 80px;height: 30px;color:#190707">Home</button>
      <button type="button" class="btn"  style="margin-left:60px;background-color:#81DAF5;width: 80px;height: 30px;color:#190707">Home</button>
      <button type="button" class="btn"  style="margin-left:60px;background-color:#81DAF5;width: 80px;height: 30px;color:#190707">Home</button>
      <button type="button" class="btn"
              style="margin-left:60px;background-color:#81DAF5;width: 80px;height: 30px;color:#190707"
              @click="toLogin">登录</button>
      <button type="button" class="btn"
              style="margin-left:60px;background-color:#81DAF5;width: 80px;height: 30px;color:#190707"
              @click="toRegister">注册</button>-->
      <Div id="top" align = "center" >
        <img src="../assets/养老院3.jpg" style="height: 400px;width: 85%" />
      </div>
      <div id='left' align="center">
        <h3>关于我们</h3>

        <p>  如何向量化计算的同时，对整个训练集预测结果𝑎，这是我们之前已经讨论过的内容。
          在本次视频中我们将学习如何向量化地计算𝑚个训练数据的梯度，本次视频的重点是如何同
          时计算 𝑚 个数据的梯度，并且实现一个非常高效的逻辑回归算法(Logistic Regression)。</p>
      </div>

      <div id="center" align="left">
        <h3 align="center">联系我们</h3>
        <p> 地址：大连西岗区胜利街50号胜利桥北西行30米<br><br>
          手机：13164580487<br><br>
          电话：0411-82566260<br><br>
          613路，526路，403路，706路公交胜利桥车站下车即是 </p>
      </div>
      <div id="right" align="center">
        <img src="../assets/用户登录.png" style="width: 105px;height: 147px;margin-top:30px" @click="toLogin"/>
        <img src="../assets/用户注册.png" style="width: 105px;height: 147px;margin-left: 15px;margin-top: 30px" @click="toRegister"/>
        <img src="../assets/护工登录.png" style="width: 105px;height:147px ;margin-left: 15px;margin-top: 30px" @click="toNurseLogin"/>
        <img src="../assets/管理员登录.png" style="width: 105px;height: 147px;margin-left: 15px;margin-top: 30px" @click="toManaLogin"/>
      </div>
      <div>
        <img src="../assets/服务项目.png" />
      </div>
      <div class="pic" onmouseover="this.className='pic_selected'" onmouseout="this.className='pic'">
        <img src="../assets/服务项目1.jpg" width="400">
        <h3>护士查房</h3>
        <p>每日24小时生活照料及安全监控，每天3次以上医生护士查房巡视。</p>
      </div>
      <div class="pic" onmouseover="this.className='pic_selected'" onmouseout="this.className='pic'">
        <img src="../assets/服务项目2.jpg" width="400">
        <h3>入院体检</h3>
        <p>免费入院体检(包含30多项的身体检查)，一对一建立健康档案，并定期更新。</p>
      </div>

      <div class="pic" onmouseover="this.className='pic_selected'" onmouseout="this.className='pic'">
        <img src="../assets/服务项目3.jpg" width="400">
        <h3>健康护理</h3>
        <p>护工和护士每天定时对养员进行户内户外健康护理，指导运动习惯、生活饮食习惯以及文化娱乐活动。</p>
      </div>
    </div>
  </main>
  </div>


</template>

<script>
export default {
  name: "Welcome",
  methods:{
    toRegister(){
      this.$router.push({path:'/Register',query:{source:'welcom'}})
    },
    toLogin(){
      this.$router.push({path:'/Login',query:{source:'用户'}})

    },
    toNurseLogin(){
      this.$router.push({path:'/Login', query:{source:'护工'}})
    },
    toManaLogin(){
      this.$router.push({path:'/Login', query:{source:'管理员'}})
    }
  }
}
</script>

<style scoped>
  #butt{
    background-color : #FFFFFF;
    width : 100%;
    height : 50px ;
    float : left
  }
  #left{
    background-color : #FFFFFF;
    width : 24%;
    height : auto;
    float : left;
    margin-left: 7%;
  }
  #center{
    background-color : #FFFFFF;
    width : 24%;
    height : auto ;
    float : left;
    margin-left: 6%;
  }
  #right{
    background-color : #FFFFFF;
    width : 28%;
    height : auto ;
    float : left;
    margin-left: 4%;
  }
  .pic{
    background-color : #FFFFFF;
    width : 24%;
    height : auto;
    float : left;
    margin-left: 7%;
    border:1px solid #C0C0C0
  }
  .pic_selected{
    background-color : #66CCFF;
    width : 24%;
    height : auto;
    float : left;
    margin-left: 7%;
    border:1px solid #C0C0C0
  }


</style>